<template>
    <div class="box">
      <div class="beijing">
        <div class="banner">
          <van-swipe :autoplay="3000">
            <van-swipe-item v-for="(v, index) in arr" :key="index">
              <img :src="v" />
            </van-swipe-item>
          </van-swipe>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import axios from "axios";
  let service = axios.create()
  export default {
    data() {
      return {
        arr: [],
      };
    },
    mounted() {
      service({
        url: "http://localhost:3000/JHswip",
        methed: "get",
      }).then((res) => {
        this.arr = res.data
      });
    },
  };
  </script>
  
  <style scoped>
  .beijing {
    width: 100%;
    height: 38.1333vw;
    background: url(@/assets/beijing.png);
    background-size: 100%;
  }
  img {
    display: block;
    width: 93%;
    height: 37.333vw;
    margin: auto;
    border-radius: 10px;
  }
  </style>